<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script src="../js/jquery-3.6.0.min.js" type="text/javascript"></script>
    <script type="text/javascript">

      $(function (){

        //获取 id 为 firstDiv 这个 div 标签下的所有级联的 p 标签
        // $("div#firstDiv p").css("color","red");

        //获取 id 为 firstDiv 这个 div 标签下的所有子级(非级联)的 p 标签
        // $("div#firstDiv > p").css("color","red");


        //只能获取当前元素紧挨着的下一个同级别的元素
        // $("p#firstP + p").css("color","red");

        //获取当前元素后面的所有指定的同级元素
        // $("p#firstP ~ p").css("color","red");



      })

    </script>
</head>
<body>

  <div id="firstDiv">

    <p>你好</p>
    <p id="firstP">你好1</p>
    <p>你好2</p>
    <div>
      <p>div你好</p>
      <p>div你好1</p>
      <p>div你好2</p>
    </div>
    <p>你好3</p>
    <p>你好4</p>


  </div>

</body>
</html>